<template>
	<view class="cu-custom bg-whites" :style="[{height:CustomBar + 'px'}]">
		<view class="cu-bar fixed bg-imgs" :style="style" :class="[bgImage!=''?'none-bg text-white bg-img':'',bgColor]">
			<view class="searchView flex-row-space-between">
				<view @click="toUrl('../home/city')" class="cityView flex-row-flex-start">
					<view class="city">
						{{address.city}}
					</view>
					<image class="jt" src="/static/common/jt.png" mode=""></image>
				</view>
			<!-- 	<view @click="toUrl('../home/city')" class="cityView flex-row-flex-start">
					<view class="city">
						{{address.city}}
					</view>
					<image class="jt" src="/static/common/jt.png" mode=""></image>
				</view> -->
				<!-- <view class="searchView1 flex1 flex-row-center" @tap.stop="(toUrl('/pages/intelligent/intelligentSearch'))">
					<uni-icons color="#000" type="search" size="24"></uni-icons>
					<view class="inputView flex1" style="margin-left: 6rpx;">
						<text  placeholder="">搜索关键字</text>
					</view>
				</view> -->
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				StatusBar: this.StatusBar,
				CustomBar: this.CustomBar
			};
		},
		name: 'home-bar',
		computed: {
			style() {
				var StatusBar = this.StatusBar;
				var CustomBar = this.CustomBar;
				var bgImage = this.bgImage;
				var style = `height:${CustomBar}px;padding-top:${StatusBar}px;background:${this.bgColor} ;`;
				if (this.bgImage) {
					style = `${style}background-image:url(${bgImage});`;
				}
				return style
			}
		},
		props: {
			address: {
				type: Object,
				default: () => {}
			},
			bgColor: {
				type: String,
				default: ''
			},
			isBack: {
				type: [Boolean, String],
				default: false
			},
			bgImage: {
				type: String,
				default: ''
			},
		},
		methods: {
			toUrl(url){
				uni.navigateTo({
					url:url
				})
				
			},
			BackPage() {
				uni.navigateBack({
					delta: 1
				});
			}
		}
	}
</script>

<style lang="scss" >
	.cu-custom {
		display: block;
		position: relative;
	}
	
	.cu-custom .cu-bar .content {
		width: calc(100% - 440upx);
	}
	
	.bg-whites{
		background: #fff;
		z-index: 99;
		// background: linear-gradient(180deg, #FF7FA233 0%, #FF7FA233 100%);
	}
	// @import './assets/iconfont/iconfont.css';
	.bg-imgs {
		width: 100%;
	
		// opacity: 0.2;
	}

	.fixed {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 99;

	}

	.searchView {
		width: 100%;
		padding: 0 30rpx;
		height: 72rpx;
	}

	.cityView {
		width: 120rpx;
	}

	.city {
		font-size: 28rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #000000;
	}

	.jt {
		margin-left: 4rpx;
		width: 8rpx;
		height: 14rpx;
	}

	.searchView1 {
		padding: 0 30rpx;
		height: 72rpx;
		// background: rgba(255,255,255,0);
		border-radius: 36rpx;
		border: 2rpx solid #000000;
	}
</style>